<template>
	<div>
		<h2>教学安排</h2>
		<hr>
		<div style="display:flex;justify-content: space-between;">
			<div style="width: 70%;border: 1px solid red;">
				<h3 style="text-align: center;">已安排的教学任务</h3>
				<table border="1" style="width: 100%;height: 75%;">
					<tr v-for="x in tasks">
						<th>{{ x.user.uid }}</th>
						<th>{{ x.user.uname }}</th>
						<th>{{ x.clz.clzno }}</th>
						<th>{{ x.clz.clzname }}</th>
						<th>{{ x.course.cno }}</th>
						<th>{{ x.course.cname }}</th>
						<th><button @click="del(x.kid)">删除</button></th>
					</tr>
				</table>
			</div>
			<div style="width: 32%;border: 1px solid #FFA500;">
				<h3 style="text-align: center;">添加新的课程安排</h3>
				教师：<select v-model="task.user.uid">
					<option v-for="x, idx in teas" v-bind:value="x.uid">{{ x.uname }}</option>
				</select><br>
				班级：<select v-model="task.clz.clzno">
					<option v-for="x, idx in clzs" v-bind:value="x.clzno">{{ x.clzname }}</option>
				</select><br>
				课程：<select v-model="task.course.cno">
					<option v-for="x, idx in courses" v-bind:value="x.cno">{{ x.cname }}</option>
				</select><br>
				<button @click="add()">添加</button>
			</div>
		</div>
	</div>
</template>
<script>
import axios from 'axios';

export default {
	data() {
		return {
			tasks: [// 初始化数据
				{
					user: { uid: '', uname: '' },
					clz: { clzno: '', clzname: '' },
					course: { cno: '', cname: '' }
				}
			],
			task: {// 初始化对象
				user: { uid: "" },
				clz: {}, course: {}
			},
			teas: [],// 初始化教师数组
			clzs: [],// 初始化班级数组
			courses: [],// 初始化课程数组
			token: ""
		}
	},
	methods: {
		add() {
			if (!this.task.user.uid || !this.task.clz.clzno || !this.task.course.cno) {
				alert("添加不允许为空");
				return;
			}
			console.log(this.task);
			this.$axios.post(this.$ip + "/api/adm/task/add", this.task, {
				headers: { 'Authorization': this.token }
			})
				.then(resp => {
					this.tasks = resp.data.data;
					console.log(resp.data.data);
				});
		},
		del(kid) {
			this.$axios.get(this.$ip + "/api/adm/task/del/" + kid, {
				headers: { 'Authorization': this.token }
			})
				.then(resp => {
					this.tasks = resp.data.data;
					console.log(resp.data.data);
				});
		}
	},
	mounted() {// 页面加载时执行
		this.token = window.localStorage.getItem("token");

		this.$axios.get(this.$ip + "/api/adm/task/findAll", {
			headers: { 'Authorization': this.token }
		}).then(resp => {
				this.tasks = resp.data.data;
				console.log(1);
				console.log(resp.data.data);
			});
		this.$axios.get(this.$ip + "/api/adm/tea/findAll", {
			headers: { 'Authorization': this.token }
		})
			.then(resp => {
				this.teas = resp.data.data;
				console.log(2);
				console.log(resp.data.data);
			});
		this.$axios.get(this.$ip + "/api/public/getClzs")
			.then(resp => {
				this.clzs = resp.data.data;
				console.log(3);
				console.log(resp.data.data);
			});
		this.$axios.get(this.$ip + "/api/public/getCourses")
			.then(resp => {
				this.courses = resp.data.data;
				console.log(4);
				console.log(resp.data.data);
			});
	}
}
</script>

<style></style>